<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js"></script>
    <title>上传</title>
</head>
<body>
<nav class="navbar navbar-default navbar-inverse " role="navigation">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">index</a>
    </div>
    <div>
        <ul class="nav navbar-nav">
            <li><a href="javascript:void(0);" onclick="tomain(this)">main</a></li>
            <li class="active"><a href="javascript:void(0);" onclick="toupload(this)">upload</a></li>
            <li><a href="javascript:void(0);" onclick="toshow(this)">show</a></li>
            <li><a href="javascript:void(0);" onclick="logout(this)">logout</a></li>
        </ul>
    </div>
</nav>
<br>
<div>
    <div class="container-fluid">
        <div class="row" style="height:80px;">

            <div class="col-sm-1"></div>
            <div class="col-sm-6">
                <form class="form-horizontal" role="form" action="upload.php" method="post" enctype="multipart/form-data">

                    <div class="form-group">
                        <label class="col-sm-2 control-label">选择图片</label>
                        <div class="col-sm-6">
                            <div class="input-group">
                                <input id='location' class="form-control" onclick="$('#i-file').click();">
                                <label class="input-group-btn">
                                    <input type="button" id="i-check" value="浏览图片" class="btn btn-info" onclick="$('#i-file').click();">
                                </label>
                            </div>
                            <input type="file" name="photo" id='i-file'  accept="" onchange="imgChanges(this)" style="display: none">
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            <button type="submit" class="btn btn-default" id="submit">提交</button>
                        </div>
                    </div>
                    <input type="text" name="userid" id='userid' style="display:none;">

                </form>
            </div>
        </div>
    </div>
</div>

</form>
</body>
<script>
    $(document).ready(function() {
        //判断用户是否登录
        var user = sessionStorage.getItem("user");
        if (user == null) {
            alert("请登录");
            window.location.href = "index.html";
        }
        user = JSON.parse(user);
        console.log(user);

        $("#userid").val(user.userid);

        //判断是否上传成功
        uploadsuccess();


    });
    function uploadsuccess()
    {
        //获取 上一个搜索页面传来的参数

        var Url = window.location.href;
        var Data = Url.split("?"); //截取 url中的“?”,获得“?”后面的参数
        var Text = decodeURI(Data[1]); //decodeURI解码
        if(Text=="0")
        {
            alert("上传成功");
        }
        else if(Text=="1")
        {
            alert("上传失败");
        }
        else
        {

        }
    }


    function imgChanges(img)
    {

        console.log("imagchange");
        $('#location').val($('#i-file').val());

    }
    function imgChange(img) {

        console.log("imagchange");
        $('#location').val($('#i-file').val());
        // 生成一个文件读取的对象
        const reader = new FileReader();
        reader.onload = function (ev) {
            // base64码
            var imgFile =ev.target.result;//或e.target都是一样的


            $("#submit").click(function () {
                upload(imgFile);
            });
        }
        //发起异步读取文件请求，读取结果为data:url的字符串形式，
        reader.readAsDataURL(img.files[0]);
    }


    function upload(base64data)
    {
        let userid=JSON.parse(sessionStorage.getItem("user")).userid;
        let photo=base64data;
        console.log("photo",photo);
        $.ajax({
            type: "POST",
            url: "upload1.php",
            data: {"userid":userid, "photo":photo, "purpose":1},
            dataType: "text",
            success: function(data)
            {   //返回值
                console.log("data",data)
                var obj = JSON.parse(data);
                var response = obj.status;
                console.log("response",response);
                if(response == "0")
                {

                }
                else if(response == "1")
                {

                }
                else if(response == "2")
                {

                }
                else if(response == "3")
                {
                    alert("failure");
                }
            },
            error: function(jqXHR,textStatus,errorThrown)
            {
                console.log(jqXHR);
                console.log(textStatus);
                console.log(errorThrown)
            }
        });
    }



    function tomain(t)
    {
        $(t).parent().siblings().removeClass("active");
        $(t).parent().addClass("active");
        window.location.href="main.html";
    }
    function toupload(t)
    {
        window.location.href="upload.html";
    }
    function toshow(t)
    {
        window.location.href="show.php?id="+JSON.parse(sessionStorage.getItem("user")).userid;

    }
    function logout(t)
    {
        sessionStorage.removeItem("user");
        window.location.href="index.html";
    }
</script>
</html>






